:root {
  --main-oColor: rgb(238, 116, 25);
  --main-wColor: rgb(256, 255, 255);
}

html,
body {
  height: 100%;
}

* {
  margin: 0;
  padding: 0;
}

body {
  background-color: rgb(240, 241, 242);
}


/* 导航栏样式代码 */
.navigation {
  color: var(--main-wColor);
  background-color: var(--main-oColor);
  height: 120px;
  line-height: 120px;
  padding-left: 140px;
}

.navigation .navi-one {
  display: inline-block;
  width: 222px;
  height: 55px;
  font-size: 35px;
}

.navigation .navi-two {
  font-size: 30px;
  margin-left: 50px;
}

.navigation .navi-one .question {
  color: var(--main-oColor);
  background-color: var(--main-wColor);
  display: inline-block;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
}

/* 新建问卷样式代码 */
.construct {
  width: 1620px;
  background-color: var(--main-wColor);
  box-shadow: 0px 2px 4px rgb(132, 133, 139);
  height: 400px;
  margin: 160px auto;
  overflow: hidden;
}

.construct-one {
  width: 200px;
  height: 60px;
  margin: 150px auto;
  font-size: 30px;
  text-align: center;
  line-height: 60px;
  color: var(--main-wColor);
  background-color: var(--main-oColor);
  box-shadow: 0px 2px 4px rgb(158, 160, 168);
}

/* 问卷编辑样式代码 */
.editor {
  background-color: var(--main-wColor);
  width: 1620px;
  margin: 150px auto;
  box-shadow: 0px 2px 4px rgb(158, 160, 168);
  display:none
}

.editor .editor-header input {
  width: 300px;
  height: 40px;
  margin: 50px;
  font-size: 30px;
  outline: none;
  line-height: 40px;
  border-style: none;
  text-align: center;
}

.editor .editor-header {
  height: 100px;
  width: 1458px;
  margin: 0 auto;
  text-align: center;
  color: #575757;
  border-bottom: solid 3.5px #7c6464;
  overflow: hidden;
  font-weight: 700;
  margin-bottom: 40px;
}



.editor .editor-add {
  width: 1425px;
  height: 110px;
  text-align: center;
  line-height: 110px;
  font-size: 30px;
  color: rgb(143, 138, 138);
  background-color: #e6e3e3;
  box-shadow: 0px 2px 4px rgb(167, 168, 175);
  margin: 0 auto;
  margin-bottom: 35px;
}

.editor-add:hover {
  background-color: #eb9451;
}

.editor .editor-add-option {
  width: 1425px;
  height: 110px;
  margin: 0 auto;
  margin-top: 70px;
  align-items: center;
  border-top: solid 1.5px #cecece;
  border-left: solid 1.5px #cecece;
  border-right: solid 1.5px #cecece;

}

.editor .editor-add-option div {
  width: 110px;
  height: 40px;
  font-size: 20px;
  text-align: center;
  line-height: 40px;
  background-color: rgb(238, 238, 238);
  border: solid 1px #989898;
}

.editor .two span {
  font-family: 'icomoon';
  font-size: 25px !important;
  vertical-align: middle;
}

.editor .editor-add-option div span {
  font-family: 'icomoon';
  font-size: 20px;
}

.editor .editor-add-option {
  padding: 0 400px;
  box-sizing: border-box;
}

.editor .two {
  margin-left: 140px;
}

.editor .three {
  margin-left: 140px;
}

.editor .editor-footer {
  display: flex;
  width: 1458px;
  height: 200px;
  margin: 0 auto;
  font-size: 25px;
  line-height: 200px;
  border-top: solid 3px #a6a2a2;
  justify-content: space-between;
}

.editor .editor-footer .editor-footer-right {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 350px;
  height: 100px;
  margin-right: 100px;
  
}

.editor .editor-footer .editor-footer-left {
  width: 400px;
  margin-left: 100px;
}

.editor .editor-footer .editor-footer-right p {
  margin-top: 100px;
  width: 35%;
  height: 50px;
  line-height: 50px;
  border: solid 1px rgb(184, 183, 183);
  text-align: center;
}



.editor .editor-footer .editor-footer-left input {
  width: 180px;
  margin-left: 40px;
  font-size: 25px;
  height: 50px;
  
}

.editor .editor-footer .editor-footer-right p:hover {
  background-color: #fa954d;
}

/* 单选题样式代码 */
.radio{
  width: 1425px;
  height: 220px;
  font-size: 25px;
  margin: 0 auto;
}

.text {
  width: 1425px;
  height: 220px;
  font-size: 25px;
  margin: 0 auto;
}

.checkbox {
  width: 1425px;
  height: 220px;
  font-size: 25px;
  margin: 0 auto;
  
}

.editor label {
  color: #979797;
  font-size: 20px;
}

.editor .text textarea {
  margin-top: 15px;
  margin-left: 90px;
  width: 280px;
  height: 60px;
  border-color: #979797;
}

.radio:hover,
.text:hover,
.checkbox:hover {
  background-color: #fdf1e6;
}

.editor .radio p,.editor .checkbox p,.editor .text p {
  padding-top: 15px;
  margin-left: 30px;
  font-weight: 600;
}


.editor input {
  margin-top: 15px;
  margin-left: 90px;
}


/* 被选中标签样式代码 */
.checked {
  background-color: var(--main-oColor) !important;
  color: var(--main-wColor) !important;
}

/* 遮罩层样式代码 */
.tips {
  position: fixed;
  top: 0; 
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 999;
  font-size: 23px;
  background-color: rgba(143, 143, 143, 0.5);
}

/* 发布和删除的提示框样式代码 */
#time {
  color: rgb(89, 235, 162);
}

.tips div:first-child {
  position: relative;
  width: 400px;
  height: 230px;
  margin: 150px auto;
  background-color: rgb(256, 255, 255);
}

.tips div:first-child p {
  color: rgb(132, 132, 132);
  margin-top: 30px;
  margin-left: 20px;
}

.tips div:first-child .button button:first-child {
  position: absolute;
  top: 183px;
  left: 77px;
}

.tips div:first-child .button button:last-child {
  position: absolute;
  top: 183px;
  left: 248px;
}

.tips div:first-child .button button {
  width: 80px;
  font-size: 20px;
}

.tips div:first-child p:first-child {
  display: flex;
  width: 100%;
  height: 45px;
  margin-left: 0;
  line-height: 45px;
  justify-content: space-between;
  font-weight: 700;
  background-color: #f7f7f7;
}

.tips>div p:first-child span:first-child {
  margin-left: 20px;
}

.tips>div p:first-child span:last-child {
  font-family: 'icomoon';
  margin-right: 20px;
  font-size: 35px;
  cursor: pointer;
}

/* 列表页样式代码 */
.tab {
  background-color: var(--main-wColor);
  box-shadow: 0px 1px 5px #9ea0a8;
  width: 1352px;
  margin: 150px auto;
  display: none;
}

.tab .tab-header,
.tab .tab-child,
.tab .tab-footer {
  height: 80px;
  position: relative;
  line-height: 80px;
  border-bottom: 1.5px solid rgb(204, 197, 197);
  font-size: 25px;
}

.tab .tab-add {
  position: absolute;
  left: 100%;
  top: 25px;
  transform: translate(-200%,0);
  width: 150px;
  height: 40px;
  cursor: pointer;
  line-height: 40px;
  text-align: center;
  border: 1.2px solid #a1a1a1;
}


.tab  span {
  position: absolute;
  color: #6c6c6c;
}


.tab-header span:nth-of-type(1),
.tab-child span:nth-of-type(1),
.tab-footer span:nth-of-type(1) {
  position: absolute;
  left: 110px;
}

.tab .tab-header span:nth-of-type(2),
.tab .tab-child span:nth-of-type(2),
.tab .tab-footer span:nth-of-type(2) {
  position: absolute;
  left: 390px;
}

.tab .tab-header span:nth-of-type(3),
.tab .tab-child span:nth-of-type(3),
.tab .tab-footer span:nth-of-type(3) {
  position: absolute;
  left: 590px;
}

.tab .tab-header span:nth-of-type(4),
.tab .tab-child span:nth-of-type(4),
.tab .tab-footer span:nth-of-type(4) {
  position: absolute;
  left: 710px;
}

.tab .tab-header span:nth-of-type(4) div,
.tab .tab-child span:nth-of-type(4) div,
.tab .tab-footer span:nth-of-type(4) div {
  width: 90px;
  display: inline-block;
  height: 30px;
  border: solid 1px #a1a1a1;
  line-height: 30px;
  text-align: center;
  font-size: 20px;
}

.tab .tab-header span:nth-of-type(4) div:hover,
.tab .tab-child span:nth-of-type(4) div:hover,
.tab .tab-footer span:nth-of-type(4) div:hover {
  background-color: var(--main-oColor);
  color: var(--main-wColor);
}


.tab input {
  zoom: 150%;
  vertical-align: middle;
  margin-left: 25px;
}

.tab .tab-footer span {
  left: 100px ;
}

.tab .tab-footer div {
  display: inline-block;
  width: 90px;
  height: 30px;
  margin-left: 120px;
  line-height: 30px;
  text-align: center;
  border: solid 1px #a1a1a1;
}

.tab .tab-footer div:hover {
  background-color: var(--main-oColor);
  color: var(--main-wColor);
  cursor: pointer;
}



/* 数据页样式代码 */
.record {
  background-color: var(--main-wColor);
  width: 1595px;
  margin: 150px auto;
  box-shadow: 0px 2px 4px #9ea0a8;
  display: none;
}

.record .header p:first-child {
  padding-top: 40px;
  font-size: 25px;
  font-weight: 700;
}

.record .header {
  border-bottom: 3px solid #a1a1a1;
  width: 1435px;
  height: 120px;
  margin: 0 auto;
  text-align: center;
  font-size: 20px;
}

.record .footer {
  width: 90%;
  height: 120px;
  margin: 0 auto;
  text-align: center;
  border-top: 3px solid #a1a1a1;
}

.record .footer p {
  height: 30px;
  width: 90px;
  margin: 50px auto;
  line-height: 30px;
  font-size: 20px;
}

.record .record-item {
  height: 150px;
  width: 1339px;
  margin: 30px auto;
  border: 3px solid rgb(209, 209, 209);
  display: flex;
}

.record .record-item div {
  display: flex;
  font-size: 20px;
  width: 50%;
}

.record .record-item .word {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding-left: 30px;
}


.record .record-item .chart {
  text-align: center;
}

.record .record-item .word .option {
  margin-left: 30px;
}

.outerBar {
  position: relative;
  width: 20rem;
  height: 1.2rem;
  margin: 1.6rem 0 0 0;
  font-size: 1.2rem;
  border: 1px solid #ccc;
}


.innerBar1 {

  display: block;
  width: 64%;
  height: 100%;
  background-color: orange;
}
.innerBar2{
  display: block;
  width: 36%;
  height: 100%;
  background-color: orange;
}
.ans-data{
  margin-left:200px;
}

.scaleNum {
  position: absolute;
  top: 0;
  right: -4rem;
}